<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>考鼎码在线练习场</title>
    <link rel="stylesheet" href="/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
    <link rel="stylesheet" href="/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
</head>

<body>


  <header>
    <div class="px-3 py-2 text-bg-dark">
      <div class="container">
        <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
          <ul class="nav col-12 col-lg-auto my-2 justify-content-center my-md-0 text-small">
            <li>
              <a href="#" class="nav-link text-white">
                <i class="bi bi-cloud-arrow-down d-block mx-auto mb-1" style="font-size: 2rem"></i>
                装载
              </a>
            </li>
            <li>
              <a href="#" class="nav-link text-white">
                <i class="bi bi-textarea-t d-block mx-auto mb-1" style="font-size: 2rem"></i>
                插入
              </a>
            </li>
            <li>
              <a href="#" class="nav-link text-secondary">
                <i class="bi bi-caret-right-fill d-block mx-auto mb-1" style="font-size: 2rem"></i>
                运行
              </a>
            </li>
            <li>
              <a href="#" class="nav-link text-white">
                <i class="bi bi-cloud-upload d-block mx-auto mb-1" style="font-size: 2rem"></i>
                保存
              </a>
            </li>
            <li>
              <a href="#" class="nav-link text-white">
                <i class="bi bi-eraser-fill d-block mx-auto mb-1" style="font-size: 2rem"></i>
                清空
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </header>

    <div class="header">
        <h1>可执行考鼎码 · 在线练习场</h1>
    </div>

    <div class="toolbar">
        <button onclick="runCode()">运行代码</button>
        <button onclick="downloadCode()">下载代码</button>
        <button onclick="clearCode()">清除代码</button>
        <!-- <button onclick="wasmIOclapshow()">鼓掌</button> -->
        <!-- 可以根据需要添加更多按钮 -->
    </div>

    <div class="content">
        <div class="editor">
            <textarea id="codeEditor"></textarea>
        </div>
        <div class="result">
            <pre id="output"></pre>
        </div>
    </div>
    <!-- 弹窗结构 -->
    <div id="clapModal" class="modal">
        <div class="modal-content">
            <!-- <span class="close-button" onclick="wasmIOclapclose()">&times;</span> -->
            <img src="assets/clap.gif" alt="Clapping GIF">
        </div>
    </div>

    <!-- include assets of bootstrap -->
    <script src="/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>

    <!-- include assets of codemirror -->
    <link rel="stylesheet" href="/codemirror-5.65.18/lib/codemirror.css">
    <link rel="stylesheet" href="/codemirror-5.65.18/theme/solarized.css">
    <!-- <link rel="stylesheet" href="/codemirror-5.65.18/addon/hint/show-hint.css"> -->
    <script src="/codemirror-5.65.18/lib/codemirror.js"></script>
    <script src="/codemirror-5.65.18/mode/ec2/ec2.js"></script>
    <script src="/codemirror-5.65.18/addon/hint/show-hint.js"></script>
    <!-- <link rel="stylesheet" href="/codemirror-5.65.18/addon/lint/lint.css -->
    <script src="/codemirror-5.65.18/addon/lint/lint.js"></script>

    <!-- include site-specific assets -->
    <script src="js/global.js"></script>
    <script src="js/wasm.js"></script>
    <link rel="stylesheet" href="css/global.css">

</body>

</html>
